<template>
  <div style="display: flex;">
    <div style="flex: .2;">
      <div style="margin-bottom: 10px;">
        <el-select v-model="typeVal" placeholder="请选择" size="mini">
          <el-option label="所有类型" value=""></el-option>
          <el-option v-for="item in treeDataCollect" :key="item.id" :label="item.colName" :value="item.id"></el-option>
        </el-select>
        <el-button type="primary" size="mini" @click="addType">新增类型</el-button>
      </div>
      <LeftTreeCom :tabNum="3" @updataTree='updataTree' :isSpinCollect="isSpinCollect" :isSpinIndex="isSpinIndex" @currentChangeCollect="currentChangeCollect" :treeDataCollect="typeVal === '' ? treeDataCollect : treeDataCollect.filter(item => item.id === typeVal)" :treeDataIndex="treeDataIndex" :autoExpandParent="false" :expandOnClick="true" :isInput="true" :isAddCom="false" :isAction="false" :isDraggable="false" :pathName="pathName" :isSpin="isSpin" @deleteNode="deleteNode" @addClick="addClick" ref="leftTreeCom1" :title="'指标目录'" :treeData="IndStandardTreeData" @currentChange="currentChange" :isShowDeUpGrede="true" @getClassTreeByVisionId="getClassTreeByVisionId" @updataVision="updataVision" />
      <!-- <el-tree :data="treeData1"></el-tree> -->
    </div>
    <el-divider direction="vertical" class="divider"></el-divider>
    <div style="flex: 1;">
      <LeftTreeCom :tabNum="3" @updataTree='updataTree' :isSpinCollect="isSpinCollect" :isSpinIndex="isSpinIndex" @currentChangeCollect="currentChangeCollect" :treeDataCollect="treeDataVision" :treeDataIndex="treeDataIndex" :autoExpandParent="false" :expandOnClick="true" :isInput="true" :isAddCom="false" :isAction="false" :isDraggable="false" :pathName="pathName" :isSpin="isSpin" @deleteNode="deleteNode" @addClick="addClick" ref="leftTreeCom2" :title="'指标目录'" :treeData="IndStandardTreeData" @currentChange="currentChange" :isShowDeUpGrede="true" :treeType="treeType" :currentVisionNode="currentVisionNode" />
      <!-- <el-tree :data="treeData2"></el-tree> -->
    </div>
  </div>
</template>

<script>
import LeftTreeCom from '@/components/leftTreeCom'
export default {
  name: 'AssetCategory',
  components: { LeftTreeCom },
  data () {
    return {
      typeVal: '',
      treeType: 'visionClass',
      isSpinCollect: false,
      isSpinIndex: false,
      treeDataCollect: [],
      treeDataVision: [],
      treeDataIndex: [],
      pathName: 'IndexMgt',
      isSpin: false,
      IndStandardTreeData: [],
      treeData1: [{
        label: '默认视角',
        children: [{
          label: '内部资产'
        }, {
          label: '外部资产'
        }]
      }, {
        label: '指标',
        children: [{
          label: '分析对象'
        }, {
          label: '应用场景'
        }, {
          label: '用户层级'
        }, {
          label: '用户岗位'
        }, {
          label: '指标来源'
        }]
      }, {
        label: '标准',
        children: [{
          label: '业务标准'
        }, {
          label: '技术标准'
        }]
      }],
      treeData2: [{
        label: '一级分类A',
        children: [{
          label: '二级分类A1'
        }]
      }, {
        label: '一级分类B',
        children: [{
          label: '二级分类B1'
        }]
      }, {
        label: '一级分类C',
        children: [{
          label: '二级分类C1'
        }]
      }],
      currentVisionNode: {}
    }
  },
  created () {
    this.getCollectFolder()
  },
  methods: {
    addType () {
      this.treeDataCollect.push({ title: "", isAdd: true, children: [] })
      this.$nextTick(() => {
        this.$refs.leftTreeCom1.$refs.inputRef.focus()
      })
    },
    updataVision () {
      this.treeDataVision = []
    },
    //树节点拖拽移动后更新数据
    updataTree (data, draggingNode) {
      console.log()
    },
    currentChangeCollect () {

    },
    deleteNode () {},
    addClick () {},
    currentChange () {},
    getCollectFolder () {
      this.Api.collectListTree({
        // colDataType: 'INDEX',
        // colNodeType: 'F'
      }).then(res => {
        this.treeDataCollect = res.data
        this.formatTreeData(this.treeDataCollect, 'collect')
      })
    },
    getClassTreeByVisionId (node) {
      this.currentVisionNode = node
      this.Api.getClassTreeByVisionId({
        id: node.data.id
      }).then(res => {
        this.treeDataVision = res.data ? res.data : []
        this.formatTreeData(this.treeDataVision, 'collect')
      })
    },
    formatTreeData (data, type) {
			data.forEach(item => {
        if(type === 'standard') {
            item.value = item.id
            item.label = item.stdName
            item.title = item.stdName
            if (item.children.length !== 0) {
              item.icon = 'folder'
              this.formatTreeData(item.children, type)
            }
        } else {
            item.childCount = item.children.length
            item.title = item.colName
            if (item.colNodeType === 'F'){
              item.icon = 'folder'
            }
            if (item.children.length !== 0) {
              this.formatTreeData(item.children, type)
            }
        }
      })
    }
  }
}
</script>

<style lang="less" scoped>
.divider {
  height: auto;
}
</style>
